<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="./css/iconfont.css">
    <link rel="stylesheet" href="./monaco-editor/min/vs/editor/editor.main.css">
    <link rel="stylesheet" href="./css/panel.css">
</head>

<body>
    <div class="key-section">
        <div class="mask"></div>
        <div class="keypanel">
            <h3>__MSG_setSecretKey__</h3>
            <textarea id="extkey" rows="5" placeholder="__MSG_keyphd__"></textarea>
            <div>
                <a id="btnWhat">__MSG_whatIs__</a>
                <button id="btnSave">__MSG_save__</button>
            </div>
        </div>
    </div>
    <div class="log-section">
        <header>
            <div class="left">
                <span id="clear" title="__MSG_clear__">
                    <i class="iconfont iconclearup"></i>
                </span>
                <span id="split">&nbsp;</span>
                <div class="search-wrap">
                    <label id="search-icon" for="search">
                        <i class="iconfont iconsearch1187938easyiconnet"></i>
                    </label>
                    <input id="search" type="search" placeholder="__MSG_keywords__">
                </div>
    
                <label>__MSG_level__</label>
                <div class="level-wrap">
                    <div title="__MSG_info__" id="info" class="active"></div>
                    <div title="__MSG_warn__" id="warn"></div>
                    <div title="__MSG_error__" id="error"></div>
                </div>
    
                <div class="custom-control custom-checkbox" title="__MSG_preserve1__">
                    <input class="custom-control-input" id="check-preserve" type="checkbox">
                    <label class="custom-control-label" for="check-preserve">__MSG_preserve2__</label>
                </div>
                <div class="custom-control custom-checkbox" title="__MSG_scroll1__">
                    <input class="custom-control-input" id="check-scroll" type="checkbox" checked>
                    <label class="custom-control-label" for="check-scroll">__MSG_scroll2__</label>
                </div>
                <span id="settings" title="__MSG_setSecretKey__">
                    <i class="iconfont iconkey"></i>
                </span>
            </div>
            <div class="right">
                <span id="count-info">__MSG_total__<i id="total-count">0</i>__MSG_pieces__</span>
                <span id="filter-info"></span>
            </div>
        </header>
        <ul id="logs"></ul>
        <div id="no-data">__MSG_nodata__</div>
        <footer>
            <span class="desc">
                <a class="line-link" href="https://github.com/eshengsky/ServerLog/tree/master/chrome-extension-server-log"
                    target="_blank">Code</a> with
                <i class="iconfont iconlove" title="love"></i> by
                <a class="line-link" href="https://github.com/eshengsky" target="_blank">Sky</a>
            </span>
            <div id="version-info">
                <span>__MSG_version__</span><span id="curr-version"></span>, <span id="update-info">__MSG_checkUpdating__</span>
            </div>
        </footer>
    </div>
    <script src="./monaco-editor/min/vs/loader.js"></script>
    <script src="./js/panel.js"></script>
</body>

</html>